<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>BEIS - 登录</title>

<link href="../css/bootstrap-combined.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/layoutit.css" rel="stylesheet" type="text/css">
<link href="../css/bootstrap.min.css" rel="stylesheet" type="text/css">
<script src="../js/jquery-2.0.0.min.js"></script>
<script src="../js/jquery-ui.js"></script>
<script src="../js/jquery.htmlClean.js"></script>
<!-- <script src="../js/scripts.js"></script> -->
<script src="../js/bootstrap.min.js"></script>

<style>
/**  
                     * 设置背景图全屏覆盖及固定  
                     * 设置内部元素偏移  
                     */
body {
	/*此处背景图自行替换*/
	background: url('../img/login.png') no-repeat center center fixed;
	background-size: cover;
	min-height: 100vh;
	box-sizing: border-box;
	margin: 0;
	padding-top: calc(50vh - 6em);
	font: 150%/1.6 Baskerville, Palatino, serif;
}

/**  
                     * 整体居中功能；  
                     * 背景透明虚化  
                     * 溢出隐藏  
                     * 边缘圆角化  
                     * 文字增加淡阴影  
                     */
.description {
	position: relative;
	margin: 0 auto;
	padding: 1em;
	max-width: 23em;
	background: hsla(0, 0%, 100%, .25) border-box;
	overflow: hidden;
	border-radius: .3em;
	box-shadow: 0 0 0 1px hsla(0, 0%, 100%, .3) inset, 0 .5em 1em
		rgba(0, 0, 0, 0.6);
	text-shadow: 0 1px 1px hsla(0, 0%, 100%, .3);
}

/*使用滤镜模糊边缘*/
.description::before {
	content: '';
	position: absolute;
	top: 0;
	rightright: 0;
	bottombottom: 0;
	left: 0;
	margin: -30px;
	z-index: -1;
	-webkit-filter: blur(20px);
	filter: blur(20px);
}
</style>

<script type="text/javascript">
	function login() {
		var user_id = $('#user_id').val();
		var pwd = $('#pwd').val();
		var user_type = $('#user_type').val();

		if (user_type != '1' && user_type != '2' && user_type != '3' && user_type != '4') {
			alert("请选择账户类型");
			return;
		} else if (user_id == '') {
			alert('请输入账户名');
			return;
		} else if (pwd == '') {
			alert('请输入密码');
			return;
		} else {
			$.ajax({
				type : 'POST',
				url : '/management/login',
				data : {
					user_id : user_id,
					pwd : pwd,
					user_type : user_type
				},
				dataType : 'json',
				success : function(res) {
					if (res.code == 200) {
						// 登录成功
						var to = "";
						switch (user_type) {
						case '1':
							to = "/html/school_main.html";
							break;
						case '2':
							to = "/html/county_main.html";
							break;
						case '3':
							to = "/html/city_main.html";
							break;
						case '4':
							to = "/html/leader_main.html";
							break;
						default:
							break;
						}
						window.location.href = to;
					} else {
						alert(res.msg);
						return;
					}
				},
				error : function() {
					alert('服务器异常');
					return;
				}
			});
		}
	}
</script>

<script>
	$(this).keydown(function(e) {
		if(e.which == '13') {
			login();
		}
	})
</script>

</head>
<body style="margin:0;">

	<div align="center" class="description">
		<table>
			<tr align="center">
				<th colspan="4"><img src="../img/BEIS.png" style="width:20%;">
					<p style="font-size:18px;color:#9B9B9B;">中职教育基础信息平台</p>
					<hr>
				<th>
			</tr>
			<tr align="center">
				<td colspan="4"><select id="user_type">
						<option style="display:none;" disabled selected>请选择账户类型</option>
						<option value="1">学校</option>
						<option value="2">区县教育局</option>
						<option value="3">市教育局</option>
						<option value="4">高级领导</option>
				</select></td>
			</tr>
			<tr align="center">
				<td colspan="4"><input id="user_id" type="text"
					placeholder="账户名"></td>
			</tr>
			<tr align="center">
				<td colspan="4"><input id="pwd" type="password"
					placeholder="密码"></td>
			</tr>
			<tr>
				<td align="left" colspan="2" style="font-size:14px;">没有账号？<a
					style="color:red;" href="/html/register.html">注册</a>
				</td>
				<td align="right" colspan="2" style="font-size:14px;"><a>忘记密码</a></td>
			</tr>
			<tr align="center">
				<td colspan="4">
					<button type="button" class="btn btn-primary btn-block"
						onclick="login()">登录</button>
				</td>
			</tr>
		</table>
	</div>

</body>
</html>